<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人中心模块</title>
    <link rel="stylesheet" href="CSS/userCenter_person.css">
    <script src="js/jquery-3.4.1.min.js"></script>
    <script>
        $(function(){
            $('#personinfo input').focus(function(){
                $(this).parent().css('color','rgb(255, 123, 0)')
            })
            $('#personinfo input').blur(function(){
                $(this).parent().css('color','#666')
            })
        })
    </script>
</head>

<body>
    <div id="personinfo">
        <form action="#">
            <ul>
                <li>昵称：<input type="text" required autofocus placeholder="请填写昵称">*必填</li>
                <li>性别：
                    <input type="radio" name="sex" checked><span>男</span>
                    <input type="radio" name="sex"><span>女</span>
                    <input type="radio" name="sex"><span>保密</span>
                </li>
                <li>所在城市：<input type="text" placeholder="请填写所在城市"></li>
                <li>出生日期：<input type="date"></li>
                <li>邮箱地址：<input type="email" placeholder="请填写正确的邮箱地址！">*必填</li>
                <li>个人简介：<input type="text" id="intro" placeholder="个人介绍..."></li>
                <li><input type="button" value="保存"></li>
            </ul>
        </form>
    </div>

</body>

</html>